import { useEffect } from "react";

export function RootViewPort({children}:{children:React.ReactNode}){
    useEffect(() => {
        // 将 body 元素的 margin 和 padding 设为 0，确保内容铺满整个视口
        document.body.style.margin = '0';
        document.body.style.padding = '0';
        document.body.style.width = '100vw';
        document.body.style.height = '100vh';
        document.body.style.overflow = 'hidden';
        // 还原时清理
        return () => {
            document.body.style.margin = '';
            document.body.style.padding = '';
            document.body.style.width = '';
            document.body.style.height = '';
            document.body.style.overflow = '';
        };
    }, []);

    return <div style={{
        width: '100vw',
        height: '100vh',
    }}>{children}</div>;
}